import React, { memo } from "react";

import { Row, Col } from "antd";
import Styles from "./index.module.less";

import DashboardCard from "./card";
import ChartComponent from "./chart";

const CardList = [
  {
    title: "前台访问量",
  },
  {
    title: "接口请求次数",
  },
  {
    title: "页面404",
  },
];

function Dashboard(props) {
  const handleClick = () => {
    props.history.push("/service");
  };
  return (
    <div>
      <Row>
        {CardList.map((item, index) => {
          return (
            <Col key={`list-${index}`} className={Styles["listItem"]} span="8">
              <DashboardCard {...item} />
            </Col>
          );
        })}
      </Row>
      <ChartComponent />
    </div>
  );
}

export default memo(Dashboard);
